<!--
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the MIT License.
-->
<!doctype html>
<html>
    <head>
        <meta charset="utf-8" />
    </head>
    <body>
        <h1>Decorative text</h1>
        <ul>
            <li>
                Role=presentation
                <img id="decorative-1" role="presentation" src="img1.png" />
                <image id="decorative-2" role="presentation" src="img1.png" />
            </li>
            <li>
                empty alt text
                <img id="decorative-alt-empty-1" role="presentation" alt="" src="img1.png" />
                <image id="decorative-alt-empty-2" height="4px" alt="" src="img1.png" />
            </li>
            <li>
                with alt text
                <img id="decorative-alt-1" role="presentation" alt="some alt text" src="img1.png" />
                <image id="decorative-alt-2" height="4px" alt="some alt text" src="img1.png" />
            </li>
            <li>
                Image under link
                <a href="http://www.bing.com">
                    Bing
                    <img id="decorative-3" src="img1.png" />
                    <image id="decorative-4" src="img1.png" />
                </a>
            </li>
            <li>
                dimension less than 5
                <img id="decorative-4" height="4px" src="img1.png" />
                <img id="decorative-5" width="4px" src="img1.png" />
                <image id="decorative-6" width="4px" src="img1.png" />
            </li>
        </ul>
        <h1>Non-Decorative text</h1>
        <ul>
            <li>
                With some role
                <img role="img" id="non-decorative-1" src="img1.png" />
                <image role="img" id="non-decorative-2" src="img1.png" />
            </li>
            <li>
                Height = 5px
                <img id="non-decorative-3" height="5px" src="img1.png" />
                <image id="non-decorative-4" height="5px" src="img1.png" />
            </li>
            <li>
                Image with alt text
                <img id="non-decorative-alt-1" src="img1.png" alt="someAltText" />
                <image id="non-decorative-alt-2" src="img1.png" alt="someAltText" />
            </li>
            <li>
                Image with empty alt text
                <img id="non-decorative-alt-empty-1" src="img1.png" alt="" />
                <image id="non-decorative-alt-empty-2" src="img1.png" alt="" />
            </li>
        </ul>
        <h1>hidden element</h1>
        <ul>
            <li>
                <img id="hidden-1" src="img1.png" style="visibility: hidden" />
                <img id="hidden-2" src="img1.png" style="display: none" />
                <image id="hidden-3" src="img1.png" style="display: none" />
            </li>
        </ul>
    </body>
</html>
